<template>
  <div class="UnpackLink">
    <!-- 自定义 header slot -->
    <div slot="title" class="UnpackLink-dialog-title">
      <span class="UnpackLink-title-text">开通拆链配置</span>
      <img
        src="@/assets/images/taskDefinition/close.png"
        alt=""
        @click="closeDialog"
      />
    </div>
    <!-- 这里是你自定义的内容 -->
    <div class="UnpackLink-dialog-content">
      <!-- 可以添加任何自定义内容 -->
      <!-- 如果是地图页面进入的，就不显示这部分了 -->
      <div>
        <el-form ref="form" :model="UnpackLinkForm" label-width="130px">
          <el-row>
            <el-col :span="12">
              <el-form-item label="任务名称：">
                <div class="UnpackLink-input">
                  <el-input
                    v-model="UnpackLinkForm.taskName"
                    placeholder="请输入任务名称"
                  >
                  </el-input>
                </div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="开始时间：">
                <div class="UnpackLink-cron-date-picker">
                  <el-date-picker
                    v-model="UnpackLinkForm.startTime"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    type="datetime"
                    placeholder="选择日期时间"
                  >
                  </el-date-picker>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="fre-table saveBtn" @click="defineTask">保存</div>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "UnpackLink",
  data() {
    return {
      UnpackLinkForm: {
        dataSetId: 1, //测试数据集id
        taskName: "测试", //任务名称
        testType: "1", //测试类型，1：话音，2：数据，3：视频
        errorStrategy: 0, //异常处理策略，0：恢复，1：终止
        triggerRule: 1, //触发规则，1：单次触发，2：周期触发
        startTime: "2025-05-13 10:00:00", //测试开始时间，单次触发填写
        endTime: "2025-05-13 11:00:00", //测试结束时间，单次触发填写
        cron: "0 5 * * * ?", //cron表达式，周期触发填写
        duration: 30, //任务执行时长，单位分钟，周期触发时配置的任务执行的时长
        endStrategy: 1, //执行策略，1：截止时间优先，2：测试完成优先
        deviceType: 1, //设备类型，1：C，2：Ku，3：VU
        sendFlag: "0", //发送端标识，0：发送端，1：接收端 // 先默认发0

        localLongitude: "1", //本端经度
        localLatitude: "2", //本端纬度
        localAltitude: "3", //本端海拔
        remoteLongitude: "1", //对端经度
        remoteLatitude: "2", //对端纬度
        remoteAltitude: "3", //对端海拔
        initialPitch: 0, //本端初始方位
        remoteBdNum: "5", //对端北斗编号

        scatteringDeviceType: "A", //散射设备类型，A，B，散射设备填写
        waveType: 0, //uv设备波形类型，0：171，1：173，UV设备填写
        channel: 1, //波道号
        sendPower: "", //发射功率，散射设备是数值；vu台，1：小功率，3：大功率
        freqType: 1, //频率类型，1：点频，2：跳频，3：扫频
        freq: "1", //通信频率。uv的通信频率，同时也是散射低频频率
        stopFreq: "3", //结束通信频率。uv的扫频结束通信频率，同时也是散射扫频低频的结束频率
        highFreq: "2", //散射高频通信频率
        stopHighFreq: "4", //散射高频结束通信频率
        freqInterval: 10, //扫频频率间隔，uv、散射共用
        jumpTableNum: 1, //uv跳表号
        iqCollectFlag: 0, //IQ采集标志，0：不采集，1：采集
        iqBusinessData: "111100001111", //IQ业务数据，IQ不采集不填写
        iqCollectInterval: 10, //IQ采集时间间隔，IQ不采集不填写
      },
    };
  },
  computed: {},
  watch: {},
  components: {},
  props: {},
  methods: {
    // 关闭弹窗
    closeDialog() {
      this.$emit("closeDialog");
    },
    // 确定任务定义
    defineTask() {
      // 处理发送的数据
      // this.leavePageHandleData();
      console.log("点击保存了");
      this.$emit("sendData", this.UnpackLinkForm);
      console.log("this.UnpackLinkForm", this.UnpackLinkForm);
      // window.location.reload();
    },
  },
  mounted() {},
};
</script>
<!-- 因为是弹窗，所以全局方法 -->
<style lang="scss" scoped>
.UnpackLink {
  position: relative;
  width: 100%; /* 自定义弹窗宽度 */
  background: url("~@/assets/images/taskDefinition/define-background.png")
    no-repeat;
  background-size: 100% 100%;
  .UnpackLink-title {
    width: 100%;
    height: 2.5rem;
    line-height: 2.5rem;
    color: #fff;
    font-size: 1.125rem;
    margin: 0px 0.625rem 0.625rem 1.25rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    .UnpackLink-title-text {
      background: url("~@/assets/images/taskDefinition/vice-title.png")
        no-repeat;
      background-size: 100% 100%;
      flex: 1;
      padding-left: 1.5626rem;
    }
  }
  .UnpackLink-dialog-title {
    font-size: 1.375rem;
    font-weight: bold;
    background: url("~@/assets/images/taskDefinition/title.png") no-repeat;
    background-size: 100% 100%;
    height: 3.125rem;
    line-height: 3.125rem;
    margin: 0.3125rem;
    padding: 0 1.25rem;
    color: #b7e7fc;
    position: relative;
    .UnpackLink-title-text {
      text-align: left;
    }
    img {
      width: 1.5626rem;
      height: 1.5626rem;
      float: right;
      margin-top: 0.75rem;
      cursor: pointer;
    }
  }
  .UnpackLink-dialog-content {
    padding: 0.9375rem;
    .UnpackLink-select,
    .UnpackLink-input {
      width: 12.5rem;
      position: relative;
    }
    .UnpackLink-select-small,
    .UnpackLink-input-small {
      width: 7.5rem;
      position: relative;
    }
    .UnpackLink-select-mini,
    .UnpackLink-input-mini {
      width: 5.625rem;
      position: relative;
    }

    .UnpackLink-cron {
      display: flex;
      flex-direction: row;
      align-items: center;
      .fre-table:hover {
        color: aqua;
      }
      .UnpackLink-cron-select {
        width: 6.0625rem;
        margin-right: 0.375rem;
      }
      .UnpackLink-cron-date {
        width: 11.1875rem;
        margin-right: 0.375rem;
      }
    }
  }
}
.saveBtn {
  text-align: center;
}

.fre-table {
  width: 5.625rem;
  height: 2.5rem;
  line-height: 2.5rem;
  text-align: center;
  color: #fff;
  background: url("~@/assets/images/taskDefinition/btn.png") no-repeat;
  background-size: 100% 100%;
  margin-right: 0.625rem;
  cursor: pointer;
}

.UnpackLink-input-radio {
  display: flex;
  flex-direction: row;
  align-items: center;
  line-height: 2.5rem;
  height: 2.5rem;
}

.edit-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3); /* 半透明黑色遮罩 */
  z-index: 999; /* 确保遮罩层在最上层 */
}
</style>
